// 天气显示和查询视图

Ext.define("app.view.tool.Weatherforecast",{
	extend: 'Ext.panel.Panel',
	alias: 'widget.toolweatherforecast',
	store: 'ToolWeatherforecastStore',	
	items: [{
		xtype: 'panel',
		itemId: 'panel_top',
		border: false,
		height: 300,
		layout: 'column',
		items: [{//这里是上面面板中的左侧部分，用于放置4天的天气详情。此panel下有4个列的panel，分别对应一天
			xtype: 'panel',
			itemId: 'panel_top_left',
			border: false,
			layout: 'column',
			defaults: {			
				style: "textAlign:center;padding:20px"
			},		
			items: [{
				xtype: 'panel',
				cls: 'panel_top_left_all',
				border: false,
				width: 250,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_left_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_left_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_left_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 50
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}]
			}]
		},{//这里是上面面板中的右侧部分，用于放置穿衣指数等信息。
			xtype: 'panel',
			itemId: 'panel_top_right',
			border: false,
//			width: 1000,
			layout: 'column',
			defaults: {			
				style: "textAlign:center;padding:20px"
			},
			items: [{
				xtype: 'panel',
				cls: 'panel_top_right_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 'auto'
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_right_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 'auto'
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_right_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 'auto'
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_right_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 'auto'
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_right_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 'auto'
				}]
			}, {			
				xtype: 'panel',
				cls: 'panel_top_right_all',
				border: false,
				width: 150,
				items: [{			
					xtype: 'panel',	
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 30
				}, {
					xtype: 'panel',
					border: false,
					height: 'auto'
				}]
			}]
		}]
	}, {
		xtype: 'form',
		defaultType: 'textfield',
		width: 500,
		border: false,
		layout: 'column',
		items: [{
			fieldLabel: '查询城市',
			name: 'cityname',
			emptyText: '上海',
			allowBlank: false
		}, {
			xtype: 'button',
			text: '查询',
			action: 'submitBtn'
		}]
	}],

	initComponent: function(){//初始化方法
		this.callParent(arguments);			
	}
});